import React from 'react';
import { Row, Col, Form, InputNumber } from 'antd';
import SalaryRefTable from '@/components/SalaryRefTable';
import { DiffSalary } from '@/pages/Recruitment/Hire/Communicate/containers';
import { formatToThreePart } from '@/utils/utils';

import { formItemLayout, oneLineLayout, renderItem, adjustRenderItem } from '../util';

export default function SuggestSalary({ hireInfo, talentInfo, applyData, commInfo, isEdit = true, form }) {
    const diffProps = {
        oneLineLayout,
        commInfo,
        talentInfo,
        form
    };

    return (
        <>
            <Row>
                {renderItem({
                    label: '职位职级',
                    value: talentInfo?.positionName ?? ''
                })}
                {renderItem({
                    label: '建议年薪',
                    value: (
                        <>
                            {formatToThreePart(commInfo?.recruitEmployMoreCommunicateSalaryVO?.newSuggestedYearSalary)}{' '}
                            <span>
                                {hireInfo?.auditRecord?.recruitTalentEmploy?.employSalaryCurrencyCode ||
                                    talentInfo?.employSalaryCurrencyCode ||
                                    talentInfo?.companyCurrencyCode}
                            </span>
                        </>
                    )
                })}
            </Row>
            <Row>
                <Col span={12}>
                    <Form.Item label="试用期月薪" {...formItemLayout}>
                        <div style={{ display: 'flex', alignItems: 'center' }}>
                            {adjustRenderItem(
                                form?.getFieldDecorator('probationMonthSalary', {
                                    initialValue: applyData?.probationMonthSalary
                                })(
                                    <InputNumber
                                    // formatter={formatToThreePart}
                                    />
                                ),
                                applyData?.probationMonthSalary,
                                isEdit
                            )}
                            <span style={{ marginLeft: 8 }}>
                                {hireInfo?.auditRecord?.recruitTalentEmploy?.employSalaryCurrencyCode ||
                                    talentInfo?.employSalaryCurrencyCode ||
                                    talentInfo?.companyCurrencyCode}
                            </span>
                        </div>
                    </Form.Item>
                </Col>
                {renderItem({
                    label: '正式月薪',
                    value: (
                        <>
                            {applyData?.officialMonthSalary}
                            <span style={{ padding: '0 5px' }}>X</span>
                            {formatToThreePart(
                                commInfo?.recruitEmployMoreCommunicateSalaryVO?.newSuggestedMonthNumber
                            ) ?? ''}
                            <span>
                                {' '}
                                {hireInfo?.auditRecord?.recruitTalentEmploy?.employSalaryCurrencyCode ||
                                    talentInfo?.employSalaryCurrencyCode ||
                                    talentInfo?.companyCurrencyCode ||
                                    '月'}
                            </span>
                        </>
                    )
                })}
            </Row>
            <Row>
                <Col span={24}>
                    <Form.Item label="薪资参考" {...oneLineLayout}>
                        <SalaryRefTable positionCode={talentInfo.positionCode} />
                    </Form.Item>
                </Col>
            </Row>
            <DiffSalary {...diffProps} />
        </>
    );
}
